#template('colorThemeInit.vm')

.xwiki-select {
  clear: both;
}

.xwiki-select-options {
  border: 1px solid #CCC;
  border-radius: 7px;
  box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.075) inset;
  padding: 5px;
  overflow-x: hidden;
  overflow-y: scroll;
}

.xwiki-select-small .xwiki-select-options {
  height: 200px;
}

.xwiki-select-medium .xwiki-select-options {
  height: 400px;
}

.xwiki-select-adaptable-medium .xwiki-select-options {
  min-height: 200px;
  max-height: 315px;
}

.xwiki-select-tall .xwiki-select-options {
  height: 800px;
}

.xwiki-select-option input[type="radio"] {
  display: none;
}

.xwiki-select-option {
  /* inline-block is better than "float: left" because when the option is hidden (because of the filtering feature), it 
     does not keep it place in the layout (which looks better) */
  display: inline-block;
  padding: 5px;
  width: 49%;
  border: 1px dotted transparent;
  list-style-type: none;
  vertical-align: top;
}

.xwiki-select-3-columns .xwiki-select-option {
  width: 32%;
}

.xwiki-select-3-columns .xwiki-select-option .xHint {
  display: none;
}

.xwiki-select-3-columns .xwiki-select-option > div {
  vertical-align: middle;
}

.xwiki-select-options > ul {
  display: flex;
  flex-wrap: wrap;
  padding-left: 0;
}

.xwiki-select-options > ul > label {
  flex-basis: 100%;
}

.xwiki-select-options > ul > li {
  flex-basis: 50%;
}

.xwiki-select-option, .xwiki-select-option > label {
  cursor: pointer;
}

.xwiki-select-option-icon {
  display: table-cell;
  font-size: 30px;
  padding-right: 10px;
  vertical-align: text-top;
}

.xwiki-select-option > div{
  display: table-cell;
  vertical-align: top;
}

.xwiki-select-option-icon > img{
  height: 20px;
  width: 20px;
}

.skin-colibri .xwiki-select-option {
  width: 47%;
}
